import 'package:flutter/material.dart';

/**
 * ClipOval：子组件为正方形时裁剪为内贴圆形，为矩形时，裁剪为内贴椭圆
 * ClipRRect:将子组件裁剪为圆角矩形
 * ClipRect:裁剪子组件到实际占用的矩形大小，溢出部分裁剪
 */
class Exam_21 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text("剪裁(Clip)"),
      ),
      body: Content(),
    );
  }
}

class Content extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // 头像
    Widget avatar = Image.asset(
      "images/img1.jpg",
      width: 60,
    );

    return Center(
      child: Column(
        children: <Widget>[
          avatar, //1.原图
          Line(),
          ClipOval(
            //2.剪裁为圆形
            child: avatar,
          ),
          Line(),
          ClipRRect(
            //3.剪裁为圆角矩形
            borderRadius: BorderRadius.circular(5.0),
            child: avatar,
          ),
          Line(),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Align(
                alignment: Alignment.topLeft,
                widthFactor: .5, //宽度设为原来宽度一半，另一半会溢出
                child: avatar,
              ),
              Text(
                "你好世界",
                style: TextStyle(color: Colors.yellow),
              )
            ],
          ),
          Line(),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              ClipRect(
                //4.将溢出部分裁剪
                child: Align(
                  alignment: Alignment.topLeft,
                  widthFactor: 0.5, //宽度设为原来宽度一半
                  child: avatar,
                ),
              ),
              Text(
                "你好世界",
                style: TextStyle(color: Colors.blue),
              )
            ],
          ),

          DecoratedBox(
            decoration: BoxDecoration(color: Colors.red),
            child: ClipRect(
              clipper: MyClipper(), //使用自定义得clipper
              child: avatar,
            ),
          )
        ],
      ),
    );
  }
}

/**分割线*/
class Line extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return SizedBox(
      width: double.infinity,
      height: 2,
      child: Container(
        color: Colors.grey[200],
      ),
    );
  }
}

class MyClipper extends CustomClipper<Rect> {
  @override
  Rect getClip(Size size) {
    // TODO: implement getClip
    return Rect.fromLTWH(10, 15, 40, 30);
  }

  @override
  bool shouldReclip(CustomClipper<Rect> oldClipper) {
    // TODO: implement shouldReclip
    return false;
  }
}
